<h2>Google OAuth 2.0</h2>

<p>state:<span class="state">{{state}}</span></p>

<div id="ats1" data-ng-show="state === STATES.FIRST">

    <p>Authorize yourself via Google OAuth</p>

    <a href="oauth/google/login">
        First:  Google OAuth initial call
    </a>

</div>

<div id="ats2" data-ng-show="state > STATES.FIRST">

    <div id="ats21" data-ng-show="state === STATES.SECOND">
        <p>Found Access Cookie: <span class="info"> {{authId}}</span></p>
        <p>Now we can query profile info via:
            <a href="" data-ng-click="getOnMyServerProfile()">Ajax request to own Server</a>

    </div>

    <p data-ng-show="state >= STATES.SECOND">
        <span>Or</span>
        <a href="" data-ng-click="clearSession()">cleanup session</a>
    </p>

</div>

<div id="ats3" data-ng-show="state === STATES.THREE">

    obtained profile:
    <pre>
        {{profile|json}}
    </pre>

</div>

<div id="ats-1" data-ng-show="state === STATES.ERROR">

    <p>Some error occured.</p>

    <pre>
        Server returns Error:{{err.status}} , {{err.data}}
    </pre>

</div>
